
.fade-enter-active, .fade-leave-active {
  transition: all .3s;

}
.fade5-enter-active, .fade5-leave-active {
  transition: all .5s;
}
.fade1s-enter-active, .fade1s-leave-active {
  transition: all 1s;
}

.fade-enter, .fade-leave-to,
.fade5-enter, .fade5-leave-to,
.fade1s-enter,.fade1s-leave-to,
{
  opacity: 0;
}

.fade-out-leave-active{
  transition:all .3s
}
.fade-out-leave-to{
  opacity: 0;
}
.fade-out3-leave-active{
  transition:all .8s
}
.fade-out3-leave-to{
  opacity: 0;
}



.fade-scale-enter-active, .fade-scale-leave-active {
  transition: all .3s;
}

.fade-scale-enter-active {
  transition-timing-function: cubic-bezier(0.77, 0, 0.18, 1);
}

.fade-scale-enter {
  transform: translate(-50%, -50%) scale(0.1) !important;
  opacity: 0;
}

.fade-scale-leave-to {
  opacity: 0;
}


//滑出
.slide-up-enter-active, .slide-up-leave-active,
.slide-down-enter-active, .slide-down-leave-active,
.slide-right-enter-active, .slide-right-leave-active,
.slide-left-enter-active, .slide-left-leave-active {
  transition: transform .3s;
}

.slide-up-enter, .slide-up-leave-to {
  transform: translateY(100%);
}

.slide-down-enter, .slide-down-leave-to {
  transform: translateY(-100%);
}

.slide-right-enter, .slide-right-leave-to {
  transform: translateX(-100%);
}

.slide-left-enter, .slide-left-leave-to {
  transform: translateX(100%);
}


.collapse-transition {
  transition: all .3s;
}


// 光标

@keyframes cursor {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes shake {
  0% {
    transform: translateX(-20px);
  }
  20% {
    transform: translateX(0);
  }
  40% {
    transform: translateX(20px);
  }
  60% {
    transform: translateX(0px);
  }

  80% {
    transform: translateX(-20px);
  }
  100% {
    transform: translateX(0px);

  }

}
@keyframes arrow {
  0% {
    transform: translateX(0);
  }
  50% {
    transform: translate(10px);
  }
  100% {
    transform: translateX(0);
  }
}
